<template>
  <div>

    <div class="flex_head">
      <span class="solid"></span>
      <span class="item_two">
          <el-button type="text" @click="handleSave">添加权限</el-button>
      </span>

    </div>
    <el-row>
      <el-table border :data="page.list">
        <el-table-column prop="id" label="ID" align="center"></el-table-column>
        <el-table-column prop="permission" label="权限" align="center"></el-table-column>
        <el-table-column label="操作" align="center">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="handleSave(scope.row.id)">修改</el-button>
            <el-button type="text" size="small" @click="handleDelete(scope.row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </el-row>
    <el-row style="text-align: right;padding-right: 20px">
      <el-pagination @current-change="loadTable" :current-page.sync="page.pageNumber" :page-size="page.pageSize"
                     layout="prev, pager, next, jumper, total" :total="page.totalRow">
      </el-pagination>
    </el-row>
  </div>
</template>

<script>


  export default {
    name: 'permissionIndex',
    data: function () {
      return {
        page: {}
      }
    },
    methods: {
      loadTable: function (number) {
        let params = {pageNumber: number}
//        http.get(http.permission, page).then(data => {
//          this.page = data
//        })
        this.$api.getPermissionList(params).then(res => {
          if (res.code == '000000') {
            console.log(res.data);
            this.page = res.data;
            this.$message.success("获取权限列表成功")
          }
        })
      },
      handleSave: function (id) {
        this.$prompt(' ', '权限', {
          confirmButtonText: '保存',
          cancelButtonText: '取消'
        }).then(({value}) => {
          let body = {permission: value}
          if (typeof id === 'number' && id) {
            body.id = id
          }

          this.$api.savePermission(body).then(res => {
            if (res.code == '000000') {
              console.log(res.data);
              this.$message.success("保存成功")
              this.loadTable(1)
            }
          })
        }).catch(() => {
        })
      },
      handleDelete: function (id) {
        this.$confirm('确定删除这个权限？', '删除权限', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
//          let body = {pathVar: id}
//          http.delete(http.permission, body).then(data => {
//            this.$message.success('删除成功')
//            this.loadTable(1)
//          })
          this.$api.deletePermission(id).then(res => {
            if (res.code == '000000') {
              console.log(res.data);
              this.loadTable(1)

            }
          })
        }).catch(() => {
        })
      }
    },
    created: function () {
      this.loadTable(1)
    }
  }
</script>

<style>

</style>
